<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="author" content="irstheme">

    <title></title>

    <!-- Icon fonts -->
    <link href="static/assets/css/font-awesome.min.css" rel="stylesheet">
    <link href="static/assets/css/themify-icons.css" rel="stylesheet">
    <link href="static/assets/css/flaticon.css" rel="stylesheet">

    <!-- Bootstrap core CSS -->
    <link href="static/assets/css/bootstrap.min.css" rel="stylesheet">

    <!-- Plugins for this template -->
    <link href="static/assets/css/animate.css" rel="stylesheet">
    <link href="static/assets/css/owl.carousel.css" rel="stylesheet">
    <link href="static/assets/css/owl.theme.css" rel="stylesheet">
    <link href="static/assets/css/slick.css" rel="stylesheet">
    <link href="static/assets/css/slick-theme.css" rel="stylesheet">
    <link href="static/assets/css/swiper.min.css" rel="stylesheet">
    <link href="static/assets/css/owl.transitions.css" rel="stylesheet">
    <link href="static/assets/css/odometer-theme-default.css" rel="stylesheet">
    <link href="static/assets/css/jquery.fancybox.css" rel="stylesheet">
    <link href="static/assets/css/style.css" rel="stylesheet">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
    <script src="static/assets/js/echarts.js"></script>

    <script src="static/assets/js/jquery.min.js"></script>
    <script src="static/assets/js/bootstrap.min.js"></script>


    <!-- Plugins for this template -->
    <script src="static/assets/js/jquery-plugin-collection.js"></script>

    <!-- Custom script for this template -->
    <script src="static/assets/js/script.js"></script>

    <!--{#<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts-all-3.js"></script>#}-->

</head>

<body>
    <!-- start page-wrapper -->
    <div class="page-wrapper">

        <!-- start preloader -->
        <div class="preloader">
            <div class="sk-folding-cube">
                <div class="sk-cube1 sk-cube"></div>
                <div class="sk-cube2 sk-cube"></div>
                <div class="sk-cube4 sk-cube"></div>
                <div class="sk-cube3 sk-cube"></div>
            </div>
        </div>
        <!-- end preloader -->

        <!-- Start header -->
        <header id="header" class="site-header header-style-2">
            <nav class="navigation navbar navbar-default">
                <div class="container">
                    <div class="navbar-header">
                        <button type="button" class="open-btn">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <a class="navbar-brand" href="index.html"><img src="static/assets/images/logo-2.png" alt></a>
                    </div>
                    <div id="navbar" class="navbar-collapse collapse navbar-right navigation-holder">
                        <button class="close-navbar"><i class="ti-close"></i></button>
                        <ul class="nav navbar-nav">
                            <li><a href="/index">首页</a></li>
                            <li><a href="/project">项目分析</a></li>
                            <li><a href="/user">用户分析</a></li>
                            <li><a href="/sample">案例分析</a></li>
                            <li><a href="/list">排行榜</a></li>
                        </ul>
                    </div>
                    <!-- end of nav-collapse -->

                    <div class="separator"></div>
                </div>
                <!-- end of container -->
            </nav>
        </header>
        <!-- end of header -->

        <!-- start features-section-s3 -->
        <!-- 内容展示 -->
        <section class="features-section-s3 section-padding bg-1">
            <div class="container">
                <div id = "projectpie" style="width:1000px;height:600px;left:5%"></div>
                <script type="text/javascript">
                    var dom = document.getElementById('projectpie');
                    var myChart = echarts.init(dom);
                    var option;
                    option = {
                        title: {
                            text: '项目报价统计'
                        },
                        tooltip: {
                            trigger: 'item'
                        },
                        legend: {
                            top: '5%',
                            left: 'center'
                        },
                        series: [
                            {
                                name: '用户等级',
                                type: 'pie',
                                radius: ['40%', '70%'],
                                avoidLabelOverlap: false,
                                label: {
                                    show: false,
                                    position: 'center'
                                },
                                emphasis: {
                                    label: {
                                        show: true,
                                        fontSize: '40',
                                        fontWeight: 'bold'
                                    }
                                },
                                labelLine: {
                                    show: false
                                },
                                data: [
                                    {value: {{prizelist[0]}}, name: '竞标出价'},
                                    {value: {{prizelist[1]}}, name: '1-1000元'},
                                    {value: {{prizelist[2]}}, name: '1001-2000元'},
                                    {value: {{prizelist[3]}}, name: '2001-3000元'},
                                    {value: {{prizelist[4]}}, name: '3001-5000元'},
                                    {value: {{prizelist[5]}}, name: '5001-10000元'},
                                    {value: {{prizelist[6]}}, name: '10000元以上'}
                                ]
                            }
                        ]
                    };
                    option && myChart.setOption(option);

                </script>
            </div>
            <!-- end container -->

            <div class="contaioner2">
                <div id="timestatus" style="width:1000px;height:600px;left:15%"></div>
                    <script type="text/javascript">
                        var dom = document.getElementById('timestatus');
                        var myChart = echarts.init(dom);
                        var option;
                        option = {
                            title: {
                                text: '项目进度统计'
                            },
                            tooltip: {
                                trigger: 'axis',
                                axisPointer: {
                                    type: 'cross',
                                    label: {
                                        backgroundColor: '#6a7985'
                                    }
                                }
                            },
                            legend: {
                                data: ['完成', '火热竞标中', '竞标中', '竞标已结束', '项目验收中']
                            },
                            toolbox: {
                                feature: {
                                    saveAsImage: {}
                                }
                            },
                            grid: {
                                left: '3%',
                                right: '4%',
                                bottom: '3%',
                                containLabel: true
                            },
                            xAxis: [
                                {
                                    type: 'category',
                                    boundaryGap: false,
                                    data: {{timelist|tojson}}
                                }
                            ],
                            yAxis: [
                                {
                                    type: 'value'
                                }
                            ],
                            dataZoom: [
                                {
                                    type: "inside"
                                }
                            ],
                            series: [
                                {
                                    name: '{{statuslist[0]}}',
                                    type: 'line',
                                    stack: '总量',
                                    areaStyle: {},
                                    emphasis: {
                                        focus: 'series'
                                    },
                                    data: {{tslist[0]}}
                                },
                                {
                                    name: '{{statuslist[1]}}',
                                    type: 'line',
                                    stack: '总量',
                                    areaStyle: {},
                                    emphasis: {
                                        focus: 'series'
                                    },
                                    data: {{tslist[1]}}
                                },
                                {
                                    name: '{{statuslist[2]}}',
                                    type: 'line',
                                    stack: '总量',
                                    areaStyle: {},
                                    emphasis: {
                                        focus: 'series'
                                    },
                                    data: {{tslist[2]}}
                                },
                                {
                                    name: '{{statuslist[3]}}',
                                    type: 'line',
                                    stack: '总量',
                                    areaStyle: {},
                                    emphasis: {
                                        focus: 'series'
                                    },
                                    data: {{tslist[3]}}
                                },
                                {
                                    name: '{{statuslist[4]}}',
                                    type: 'line',
                                    stack: '总量',
                                    areaStyle: {},
                                    emphasis: {
                                        focus: 'series'
                                    },
                                    data: {{tslist[4]}}
                                }
                            ]
                        };
                        option && myChart.setOption(option);
                </script>
            </div>

            <div class="contaioner3">
                <div id="bidnum" style="width:1000px;height:600px;left:15%"></div>
                    <script type="text/javascript">
                        var dom = document.getElementById('bidnum');
                        var myChart = echarts.init(dom);
                        var option;
                        var colors = ['#5470C6', '#91CC75'];
                        option = {
                            color: colors,
                            title: {
                            text: '项目投标统计'
                            },
                            tooltip: {
                                trigger: 'axis',
                                axisPointer: {
                                    type: 'cross'
                                }
                            },
                            grid: {
                                right: '20%'
                            },
                            toolbox: {
                                feature: {
                                    dataView: {show: true, readOnly: false},
                                    restore: {show: true},
                                    saveAsImage: {show: true}
                                }
                            },
                            legend: {
                                data: ['总投标数', '平均投标数']
                            },
                            xAxis: [
                                {
                                    type: 'category',
                                    axisTick: {
                                        alignWithLabel: true
                                    },
                                    data:{{timelist|tojson}}
                                }
                            ],
                            yAxis: [
                                {
                                    type: 'value',
                                    name: '总投标数',
                                    min: 0,
                                    max: 4000,
                                    position: 'left',
                                    axisLine: {
                                        show: true,
                                        lineStyle: {
                                            color: colors[0]
                                        }
                                    },
                                    axisLabel: {
                                        formatter: '{value} 个'
                                    }
                                },
                                {
                                    type: 'value',
                                    name: '平均投标数',
                                    min: 0,
                                    max: 20,
                                    position: 'right',
                                    offset: 80,
                                    axisLine: {
                                        show: true,
                                        lineStyle: {
                                            color: colors[1]
                                        }
                                    },
                                    axisLabel: {
                                        formatter: '{value} 个'
                                    }
                                }
                            ],
                            series: [
                                {
                                    name: '总投标数',
                                    type: 'line',
                                    data: {{numsum}}
                                },
                                {
                                    name: '平均投标数',
                                    type: 'line',
                                    yAxisIndex: 1,
                                    data: {{numavg}}
                                }
                            ]
                        };
                        option && myChart.setOption(option);
                </script>
            </div>

            <div class="container4">
                <div id = "protimepie" style="width:1000px;height:600px;left:15%"></div>
                <script type="text/javascript">
                    var dom = document.getElementById('protimepie');
                    var myChart = echarts.init(dom);
                    var option;
                    option = {
                        title: {
                            text: '项目工期统计'
                        },
                        tooltip: {
                            trigger: 'item'
                        },
                        legend: {
                            top: '5%',
                            left: 'center'
                        },
                        series: [
                            {
                                name: '工期长度',
                                type: 'pie',
                                radius: ['40%', '70%'],
                                avoidLabelOverlap: false,
                                label: {
                                    show: false,
                                    position: 'center'
                                },
                                emphasis: {
                                    label: {
                                        show: true,
                                        fontSize: '40',
                                        fontWeight: 'bold'
                                    }
                                },
                                labelLine: {
                                    show: false
                                },
                                data: [
                                    {value: {{datelist[0]}}, name: '0-7天'},
                                    {value: {{datelist[1]}}, name: '8-15天'},
                                    {value: {{datelist[2]}}, name: '16-30天'},
                                    {value: {{datelist[3]}}, name: '31-60天'},
                                    {value: {{datelist[4]}}, name: '61-90天'},
                                    {value: {{datelist[5]}}, name: '91-180天'},
                                    {value: {{datelist[6]}}, name: '180天以上'}
                                ]
                            }
                        ]
                    };
                    option && myChart.setOption(option);
                </script>
            </div>
            <!-- end container -->
        </section>
        <!-- end features-section-s3 -->

        <!-- start site-footer -->
        <footer class="site-footer">
            <div class="lower-footer bg-footer">
                <div class="container">
                    <div class="row">
                        <div class="separator"></div>
                        <div class="col col-xs-12">
                            <p class="copyright">Green Skin Technology &copy; 2021.Saoming All rights reserved.<a target="_blank" ></a></p>
                        </div>
                    </div>
                </div>
            </div>
        </footer>
        <!-- end site-footer -->
    </div>
    <!-- end of page-wrapper -->

</body>
</html>

